import {observer} from 'mobx-react-lite';
import {Path, SvgProps} from 'react-native-svg';
import {useGlobalStore} from '../../mobx';
import {getColorStr} from '../../themes';
import {SvgCommon} from './Common';

export const SvgSet = observer((props: SvgProps) => {
  const {theme} = useGlobalStore();
  return (
    <SvgCommon {...props}>
      <Path
        d="M17.074 22H8.60071C7.77906 22 7.00876 21.544 6.59794 20.8347L2.38698 13.64C1.97615 12.9307 1.97615 12.0693 2.38698 11.36L6.59794 4.16533C7.00876 3.456 7.77906 3 8.60071 3H17.074C17.8956 3 18.6659 3.456 19.0768 4.11467L23.2877 11.36C23.6986 12.0693 23.6986 12.9307 23.2877 13.64L19.0768 20.8347C18.6659 21.544 17.8956 22 17.074 22ZM8.60071 4.52C8.34395 4.52 8.08718 4.672 7.93312 4.92533L3.72216 12.12C3.5681 12.3733 3.5681 12.6267 3.72216 12.88L7.93312 20.0747C8.08718 20.328 8.34395 20.48 8.60071 20.48H17.074C17.3308 20.48 17.5875 20.328 17.7416 20.0747L21.9525 12.88C22.1066 12.6267 22.1066 12.3733 21.9525 12.12L17.7416 4.92533C17.5875 4.672 17.3308 4.52 17.074 4.52H8.60071Z"
        fill={getColorStr(theme, 'color_31')}
      />
      <Path
        d="M12.8374 16.8067C10.4238 16.8067 8.47241 14.8814 8.47241 12.5C8.47241 10.1187 10.4238 8.19336 12.8374 8.19336C15.251 8.19336 17.2025 10.1187 17.2025 12.5C17.2025 14.8814 15.251 16.8067 12.8374 16.8067ZM12.8374 9.71336C11.2968 9.71336 10.013 10.98 10.013 12.5C10.013 14.02 11.2968 15.2867 12.8374 15.2867C14.378 15.2867 15.6619 14.02 15.6619 12.5C15.6619 10.98 14.378 9.71336 12.8374 9.71336Z"
        fill={getColorStr(theme, 'color_31')}
      />
    </SvgCommon>
  );
});
